<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head lang="en">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <link rel="shortcut icon" th:href="@{/img/favicon.ico}"/>
    <link rel="bookmark" th:href="@{/img/favicon.ico}" type="image/x-icon"/>
    <link th:href="@{/css/style.css}" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" th:src="@{/js/jquery.js}"></script>
    <style type="text/css">
        #treeMenu > li {
            width: 230px;
            height: 220px;
            margin-right: 20px;
            clear: none;
            float: left;
        }

        #treeMenu ul {
            margin-left: 50px;
        }

        #treeMenu a {
            font-size: 14px;
        }

        .hidden {
            display: none;
        }
    </style>

    <script type="text/javascript">

        $(function () {
            $("#treeMenu").children("li").children(":checkbox").click(function () {
                var flag = $(this).attr("checked");
                $(this).siblings("ul").show();
                $(this).siblings("ul").children("li").children(":checkbox").attr("checked", flag);
            }).siblings("a").click(function () {
                $(this).siblings("ul").toggle();
            });
        });
    </script>
</head>
<body>
<div class="place"><span>位置：</span>
    <ul class="placeul">
        <li>系统管理</li>
        <li>职位管理</li>
        <li>赋权</li>
    </ul>
</div>
<div class="formbody">
    <div class="formtitle"><span>职位赋权</span></div>
    <!--职位id-->
    <input type="hidden" name="jobId" th:value="${jobId}">
    <ul id="treeMenu" class="forminfo">
        <li th:each="p:${pmodules}">
            <input type="checkbox" name="parent" th:value="${p.moduleId}"/>
            <a href="javascript:void(0);" th:text="${p.moduleRname}">系统管理</a>
            <ul>
                <li th:each="c:${modules}" th:if="${c.modulePid==p.moduleId}">
                    <input type="checkbox" onclick="" name="child" th:value="${c.moduleId}"/>
                    <a href="" th:text="${c.moduleRname}">用户管理</a>
                </li>
            </ul>
            </span>
        </li>
    </ul>
    <div style="clear: both">
        <input type="button"  id="doGrant" onclick="doGrant()" class="btn" value="确认赋权"/>
        <input type="button" class="btn" value="返回" onclick="window.history.go(-1);"/>
    </div>
</div>
<script>
    $(function () {//页面加载事件
        var jobId = $("input[name=jobId]").val();
        init1(jobId);//一级菜单选中
        init2(jobId);//二级菜单选中
    });
    //一级菜单
    function init1(jobId) {
        var $pmodules = $("input[name=parent]");//所有一级菜单复选框
        $.get('/sys/job/ajaxGrant1/' + jobId, '', function (data) {
            console.log(data);
            console.log( typeof data);
            $pmodules.each(function (i, e) {//所有的一级菜单
                $(data).each(function (i, d) {//所有选中的一级菜单
                    if ($(e).val() == d.compid) {//模块id进行比较
                        $(e).attr("checked","true");//当前复选框选中
                    }
                });
            });
        }, 'json');
    }
    //二级菜单
    function init2(jobId) {
        var $cmodules = $("input[name=child]");//所有二级菜单复选框
        $.get('/sys/job/ajaxGrant2/' + jobId, '', function (data) {
            console.log(data);
            console.log( typeof data);
            $cmodules.each(function (i, e) {
                $(data).each(function (i, d) {
                    if ($(e).val() == d.compid) {
                        $(e).attr("checked","true");
                    }
                });
            });
        }, 'json');
    }

    //授权操作
    function doGrant() {
        //职位id
        var jobId = $("input[name=jobId]").val();
        //模块id
        var checkList = new Array();
        $("input[type='checkbox']:checked").each(function () {
            checkList.push($(this).val())
        });
        // location.href="/sys/position/positionGrant";
        location.href="/sys/job/updatePosition?jobId="+jobId+"&mids="+checkList.toString();

    }
</script>
</body>
</html>